<template>
  <div>
    <el-form :model="dataForm" v-if="open" ref="form"  :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'" class="demo-dynamic">
      <template v-for="(domain, index) in form.formData">
      <el-form-item
        :label="domain.controlLable"
        :key="index"
        v-if="'faxon'!=domain.controlType"
      >
        <el-radio-group v-model="domain.controlValue" v-if="'radio'==domain.controlType">
          <el-radio v-for="(defaults,indexd) in domain.controlDefault.split('--__--')"
                    :label=indexd
                    :key="indexd"
          >{{defaults}}
          </el-radio>
        </el-radio-group>
        <el-input type="textarea" v-model="domain.controlValue" v-if="'textarea'==domain.controlType"
                  required></el-input>
        <el-select  v-model="domain.controlValue" v-if="'select'==domain.controlType">
          <el-option v-for="defaultss in domain.controlList"
                     :key=defaultss.key
                     :value=defaultss.key
                     :label=defaultss.value
          >
          </el-option>
        </el-select>
      </el-form-item>
      </template>
    </el-form>
    <el-button type="primary" @click="completeTask()">{{ $t("process.completeTask") }}</el-button>
    <el-button type="warning" @click="rejectTask()">{{ $t("process.rejectTask") }}</el-button>
    <el-button type="info" @click="delegateTask()">{{ $t("process.entrustTask") }}</el-button>
    <ren-task-delegate v-if="renTaskDelegateVisible" ref="renTaskDelegate"></ren-task-delegate>
    <ren-task-handle v-if="renTaskHandleVisible" ref="renTaskHandle"></ren-task-handle>
  </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import RenTaskDelegate from "./ren-task-delegate.vue";
import RenTaskHandle from "./ren-task-handle.vue";
import baseService from "@/service/baseService";
import {IObject} from "@/types/interface";
export default defineComponent({
  name: "RenProcessRunning",
  data() {
    return {
      // 是否显示退回窗口
      renTaskDelegateVisible: false,
      renTaskHandleVisible: false,
      open: false,
      content_type: "application/x-www-form-urlencoded",
      dataForm: {
        taskId: ""
      },
      // 表单参数
      form: {
        formData:[]
      },
    };
  },
  components: {
    RenTaskDelegate,
    RenTaskHandle,
  },
  computed: {
      dataRule(): IObject {
        return {
          controlValue: [{ required: true, message: this.$t("validate.required"), trigger: "blur" }]
        };
      }
  },
  created() {
    this.dataForm.taskId = this.$route.query.taskId as string;
    this.form.formData=[];
    this.initFormData()
  },
  methods: {
    //加载表单属性
    initFormData(){
      baseService
        .get("/flow/common/formDataShow/"+this.dataForm.taskId, {}, {
          "content-type": this.content_type
        })
        .then((res) => {
          if (res.code !== 0) {
            this.$message.error(res.msg);
            return;
          }
          this.parseData(res.data)
        });
    },
    parseData(datas){
      /**
       * 选择  select
       1、本部门及以下
       2、角色部门及以下
       3、所有部门
       4、自定义选择项
       不需要选择 faxon
       默认所有
       new_property_1--__!!textarea--__!!批注--__!!f__!!null
       new_property_1 下一个参数名称
       textarea 标签名称
       批注 标签label
       i 表示为参数 f表示 不是参数
       null 默认值
       //若为选择框 主要是为了解决 下一个节点可以选择接收人 因此 自定义协议如下
       若为faxon 默认为全部人

       select选择框固定数据G@

       例如 TA@id@real_name@test角色id（由于数据库表结构固定 所以这里可以舍弃@id@real_name）
       TA@test角色名称
       TA表示查用户表所包含的部门以及本部门拥有该角色的人
       TB表示只能查询本部门的拥有该角色的人
       TC表示采用其他表结构
       //可以舍弃 id、real_name表示用户表的键值对
       test表示是角色 如果为空就表示所有人
       */
      let formData = []
      for (let i = 0; i < datas.length; i++) {
        let strings = datas[i].split('--__!!')
        let controlValue = null
        let controlDefault = null
        let controlList = []
        let is_select=false;
        switch (strings[1]) {
          case 'radio':
            controlValue = 0;
            controlDefault = strings[4]
            break;
          case 'text':
            controlDefault = strings[4]
            break;
          case 'textarea':
            controlDefault = strings[4]
            break;
          case 'select':
            // controlValue = null;
            console.log(333)
            if(strings[4].substring(0,1).toString()=='T'){
              let strings2 = strings[4].split('@')
              console.log(strings2)
              if(strings2.length<2)break;
              if(strings2[0].length==2){
                is_select=true;
                if(strings2[0]=='TA'){
                  this.getUserList("2",strings2[1],strings[0],true);
                }else{
                  this.getUserList("1",strings2[1],strings[0],true);
                }
              }
            }else if(strings[4].substring(0,1).toString()=='G'){
              let strings2 = strings[4].split('@')
              if(strings2.length<2)break;
              let arr=strings2[1].split(",");
              let arr1=[];
              for(let i=0;i<arr.length;i++){
                arr1[arr1.length]={"key":arr[i],"value":arr[i]};
              }
              controlList=arr1;
            }
            break;
          case 'faxon':
            // controlValue = null;
            if(strings[4].substring(0,1)=='T'){
              let strings2 = strings[4].split('@')
              if(strings2.length<2)break;
              if(strings2[0].length==2){
                is_select=true;
                if(strings2[0]=='TA'){
                  this.getUserList("2",strings2[1],strings[0],false);
                }else{
                  this.getUserList("1",strings2[1],strings[0],false);
                }
              }
            }else if(strings[4].substring(0,1)=='G'){
              let strings2 = strings[4].split('@')
              if(strings2.length<2)break;
              controlValue=strings2[1].join();
            }
            break;
          default:
        }
        formData.push({
          controlId: strings[0],
          controlType: strings[1],
          controlLable: strings[2],
          controlIsParam: strings[3],
          controlValue: controlValue,
          controlDefault: controlDefault,
          controlList:controlList
        })
        // formData[formData.length]=obj;
      }
      this.form.formData = formData;
      this.open = true;
    },
    getUserList(type,roleId,id,isShow){
      console.log("type:"+type);
      console.log("roleId:"+roleId);
      baseService
        .get("/flow/common/personByRole", {"type":type,"roleId":roleId}, {
          "content-type": this.content_type
        })
        .then((res) => {
          if (res.code !== 0) {
            this.$message.error(res.msg);
            return;
          }
          let index=this.form.formData.findIndex(item => item.controlId=id)
          let obj=this.form.formData[index]
          if(isShow){
            let arr=[];
            res.data.forEach(function(val,index){
              arr[arr.length]={"key":val.id,"value":val.realName}
            })
            obj.controlList=arr;
          }else{
            let d=""
            res.data.forEach(function(val,index){
              d+=val.id+",";
            })
            d=d.length>0?d.substring(0,d.length-1):d;
            obj.controlValue=d;
          }
        });
    }
    ,
    completeTask() {
      this.renTaskHandleVisible = true;
      this.$nextTick(() => {
        this.$refs.renTaskHandle.dataForm.taskId = this.dataForm.taskId;
        let data=this.form.formData
        let arr=[];
        data.forEach(function(val,index){
          delete val.controlList
          arr[arr.length]=val;
        })
        this.$refs.renTaskHandle.dataForm.formDataStr= JSON.stringify(arr);
        this.$refs.renTaskHandle.handleType = "complete";
        this.$refs.renTaskHandle.init();
      });
    },
    rejectTask() {
      this.renTaskHandleVisible = true;
      this.$nextTick(() => {
        this.$refs.renTaskHandle.dataForm.taskId = this.dataForm.taskId;
        this.$refs.renTaskHandle.handleType = "reject";
        this.$refs.renTaskHandle.dataForm.formDataStr= null;
        this.$refs.renTaskHandle.init();
      });
    },
    delegateTask() {
      this.renTaskDelegateVisible = true;
      this.$nextTick(() => {
        this.$refs.renTaskDelegate.dataForm.taskId = this.dataForm.taskId;
        this.$refs.renTaskHandle.dataForm.formDataStr= null;
        this.$refs.renTaskDelegate.init();
      });
    }
  }
});
</script>
